<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>代码</title>

    <link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container">
        <h5>1.内联代码(code标签)</h5>
        <p>Hello,welcome to china! <code>my name is yuanchao.</code> I am learning Bootstrap! <code>&lt;code&gt;</code></p>

        <br>
        <h5>2.用户输入(kbd标签)</h5>
        <p>Hello,welcome to china! <kbd>my name is yuanchao.</kbd> I am learning Bootstrap! <code>&lt;code&gt;</code></p>

        <br>
        <h5>3.代码块(pre标签)</h5>
        <!--尖括号注意转义: &lt; &gt;-->
        <pre>Hello,welcome to china! my name is yuanchao. I am learning Bootstrap! &lt;code&gt;</pre>

        <br>
        <h5>4.变量(var标签)</h5>
        <!--注意,=, + 等符号是不需要var包裹的.-->
        <pre><var>y</var>=<var>m</var><var>x</var>+<var>b</var></pre>
        <pre><var>y</var>=<var>m</var><var>x</var>+<var>n</var></pre>


        <br>
        <h5>5.程序输出(samp标签)</h5>
        <!--注意:使用p或samp并没有什么明显变化, 只有字体稍微变了一点,主要是为了代码的可读性.-->
        <p>Hello,welcome to china! my name is yuanchao. I am learning Bootstrap!</p>
        <samp>Hello,welcome to china! my name is yuanchao. I am learning Bootstrap!</samp>
    </div>
</body>
</html>